<template>
  <div class="analysis-page">
    <div class="content">
      <!-- 班级列表 -->
      <ClassList :classList="classList" @classSelected="handleClassSelected" />

      <!-- 学生列表 -->
      <div class="student-section">
        <StudentList ref="studentList" :studentList="studentList" :teacherSubject="teacherSubject" />
        <!-- 分页组件 -->
        <el-pagination
          v-if="totalStudents > 0"
          background
          layout="prev, pager, next"
          :current-page="currentPage"
          :page-size="pageSize"
          :total="totalStudents"
          @current-change="handlePageChange"
        />
      </div>
    </div>
  </div>
</template>

<script>
import ClassList from "@/components/ClassList.vue";
import StudentList from "@/components/StudentList.vue";
import { fetchClassList, fetchStudentList } from "@/api/aiStuAnalysis.js"; // 引入 API 方法
import axios from 'axios';

export default {
  name: "Analysis",
  components: {  ClassList, StudentList },
  data() {
    return {
      classList: [], // 班级列表数据
      studentList: [], // 学生列表数据
      currentClassId: null, // 当前选中的班级 ID
      currentPage: 1, // 当前页码
      pageSize: 10, // 每页显示的学生数量
      totalStudents: 0, // 学生总数
      teacherSubject: '', // 当前教师教授的学科
    };
  },
  mounted() {
    this.fetchClassList(); // 获取班级列表数据
    this.fetchTeacherInfo(); // 获取当前教师信息
  },
  methods: {
    // 获取当前教师信息
    async fetchTeacherInfo() {
      try {
        const token = localStorage.getItem('token');
        if (!token) {
          console.error('没有找到认证令牌，无法获取教师信息');
          return;
        }
        
        // 获取当前教师信息
        const response = await axios.get('/api/auth/current-teacher', {
          headers: {
            'Authorization': `Bearer ${token}`
          }
        });
        
        console.log('教师信息响应详情:', response);
        
        if (response.data && response.data.success && response.data.teacher) {
          // 设置教师学科
          const rawSubject = response.data.teacher.subject;
          console.log('后端返回的原始教师学科:', rawSubject);
          
          this.teacherSubject = this.normalizeSubject(rawSubject);
          console.log('规范化后的教师学科代码:', this.teacherSubject);
          
          // 保存到localStorage以便在其他页面使用
          localStorage.setItem('teacherSubject', this.teacherSubject);
          console.log('已将教师学科保存到localStorage:', this.teacherSubject);
        } else {
          console.warn('获取教师信息失败或返回数据格式不正确:', response.data);
        }
      } catch (error) {
        console.error('获取教师信息失败:', error);
        console.error('错误详情:', error.response ? error.response.data : error.message);
      }
    },
    // 添加标准化学科代码的方法
    normalizeSubject(subject) {
      if (!subject) {
        console.log("传入的学科为空，返回空字符串");
        return '';
      }
      
      // 转为小写
      const lowerSubject = String(subject).toLowerCase();
      console.log(`[Analysis] 标准化学科输入: "${subject}", 转小写后: "${lowerSubject}"`);
      
      // 中文学科名称映射
      const zhSubjectMap = {
        '语文': 'chinese',
        '数学': 'math',
        '英语': 'english',
        '物理': 'physics',
        '化学': 'chemistry',
        '生物': 'biology',
        '政治': 'politics',
        '历史': 'history',
        '地理': 'geography'
      };
      
      // 如果是中文学科名称，转换为英文代码
      if (zhSubjectMap[subject]) {
        const result = zhSubjectMap[subject];
        console.log(`[Analysis] 找到完全匹配的中文学科名称, 转换为: "${result}"`);
        return result;
      }
      
      // 检查经过转小写后的中文名称
      if (zhSubjectMap[lowerSubject]) {
        const result = zhSubjectMap[lowerSubject];
        console.log(`[Analysis] 小写后匹配中文学科名称, 转换为: "${result}"`);
        return result;
      }
      
      // 已经是标准学科代码
      const validSubjects = ['chinese', 'math', 'english', 'physics', 'chemistry', 
                           'biology', 'politics', 'history', 'geography'];
      if (validSubjects.includes(lowerSubject)) {
        console.log(`[Analysis] 已经是标准学科代码: "${lowerSubject}"`);
        return lowerSubject;
      }
      
      // 处理简写或部分匹配
      if (lowerSubject.includes('chin') || lowerSubject.includes('yuwen') || lowerSubject.includes('语文')) {
        console.log(`[Analysis] 部分匹配语文/chinese`);
        return 'chinese';
      }
      if (lowerSubject.includes('math') || lowerSubject.includes('shuxue') || lowerSubject.includes('数学')) {
        console.log(`[Analysis] 部分匹配数学/math`);
        return 'math';
      }
      
      // 其他科目处理...
      
      // 默认返回原值
      console.log(`[Analysis] 无法匹配任何学科，返回原值: "${lowerSubject}"`);
      return lowerSubject;
    },
    // 获取班级列表数据
    async fetchClassList() {
      try {
        console.log("开始请求班级列表数据");
        const response = await fetchClassList(); // 调用真实接口
        console.log("班级列表API响应:", response);
        console.log("班级列表数据:", response.data);
        
        this.classList = response.data; // 使用返回的数据
        console.log("设置到this.classList:", this.classList);
        
        if (this.classList.length > 0) {
          console.log("选择第一个班级:", this.classList[0]);
          this.currentClassId = this.classList[0].id;
          this.fetchStudentList(this.currentClassId, this.currentPage);
        }
      } catch (error) {
        console.error("获取班级列表失败:", error);
        console.error("错误详情:", error.response || error.message || error);
        
        // 显示错误提示
        this.$message.error("获取班级列表失败，请稍后重试");
      }
    },
    // 获取学生列表数据
    async fetchStudentList(classId, page = 1) {
      this.currentClassId = classId;
      try {
        console.log(`开始请求班级ID为${classId}的学生列表数据，页码：${page}，每页大小：${this.pageSize}`);
        const response = await fetchStudentList(classId, page, this.pageSize);
        console.log("学生列表API响应:", response);
        console.log("学生数据:", response.data.data); 
        console.log("总学生数:", response.data.total);
        
        this.studentList = response.data.data; // 学生列表数据
        this.totalStudents = response.data.total; // 总学生数
        
        // 检查并记录获取到的学生数据
        if (this.studentList && this.studentList.length > 0) {
          console.log(`成功获取到${this.studentList.length}名学生数据`);
          // 检查学生成绩和profile字段
          const firstStudent = this.studentList[0];
          console.log("第一个学生数据示例:", {
            姓名: firstStudent.name,
            学号: firstStudent.studentId,
            语文: firstStudent.chinese,
            数学: firstStudent.math,
            英语: firstStudent.english,
            档案: firstStudent.profile
          });
        } else {
          console.warn(`班级ID为${classId}的学生列表为空`);
        }
      } catch (error) {
        console.error("获取学生列表失败:", error);
        console.error("错误详情:", error.response || error.message || error);
        // 显示错误提示
        this.$message.error("获取学生列表失败，请稍后重试");
      }
    },
    handleClassSelected(classId) {
      this.fetchStudentList(classId); // 切换班级时刷新学生列表
      this.currentPage = 1; // 切换班级时重置为第一页
      this.fetchStudentList(classId, this.currentPage);
    },
    handlePageChange(page) {
      this.currentPage = page;
      this.fetchStudentList(this.currentClassId, page);
    },
    // 查看特定学生信息
    viewStudentDetail(student) {
      console.log("查看学生详情:", student);
      console.log("当前教师学科为:", this.teacherSubject);
      // 使用路由导航到学生详情页面，并传递学生信息和教师学科
      this.$router.push({
        name: 'PerLearnCase',
        params: {
          studentId: student.id,
          studentName: student.name,
          teacherSubject: this.teacherSubject, // 确保传递教师学科
        }
      });
      console.log(`已将学生${student.name}(ID:${student.id})和教师学科${this.teacherSubject}传递到PerLearnCase页面`);
    }
  },
};
</script>


<style scoped>
.analysis-page {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.content {
  display: flex;
  margin-top: 60px; /* 导航栏高度 */
}

.student-section {
  flex: 4;
  padding: 20px;
}
</style>